.content {
  min-height: 100vh;
  min-width: 100vw;
  display: flex;
  flex-direction: column;
  background-color: #F6F6F9;

  .edit-user-container {
    display: flex;
    flex-direction: column;

    .user-container {
      margin: 40rpx 40rpx 0 40rpx;
      display: flex;
      flex-direction: column;
      background-color: white;
      border-radius: 14rpx;
      padding: 40rpx;
      gap: 40rpx;

      .form-item {
        display: flex;
        align-items: center;
        gap: 20rpx;
        font-size: 28rpx;

        >view:nth-child(1) {
          width: 100rpx;
        }
        >view:nth-child(2) {}
      }
    }

    .submit-btn {
      margin: 40rpx 40rpx 0 40rpx;
      text-align: center;
      padding: 20rpx 0;
      background-color: #10B981;
      border-radius: 7rpx;
      color: white;
      font-size: 28rpx;
      transition: all .1s;

      &:active {
        filter: brightness(0.9);
      }
    }
  }
}

.avatar-wrapper {
  height: 160rpx;
  width: 160rpx;
  padding: unset;
  margin: unset;
  position: relative;
  line-height: unset;

  &::after {
    border: unset;
  }

  image {
    width: 100%;
    height: 100%;
  }

  .camera {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .re {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 5rpx 0;
    font-size: 20rpx;
    text-align: center;
    color: white;
    background-color: #00000040;
  }
}

.nick-input {
  border: 1rpx solid #E5E7EB;
  padding: 12rpx 18rpx;
  border-radius: 14rpx;
  width: 100%;
  margin-left: 25rpx;

  &::placeholder {
    color: #D1D5DB;
  }
}
